<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=2.0, user-scalable=no"/>
<title>野趣平台</title>
<link href="/Public/css/event/yq.css" type="text/css" rel="stylesheet" />
<link href="/Public/css/event/font.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="/Public/js/event/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/Public/js/event/jquery.masonry.min.js"></script>
<script type="text/javascript" src="/Public/js/event/score.js"></script>

</head>	
<body style="background-color:#fcf3f0">
<div class="mask"></div>
<!------------登录------------------------->
<div class="loginBox borderRadius">
	<span class="icon iconfont icon-chahao spanClose"></span>
    <h1>用户登录</h1>
    <div class="divregist boxSize">
        <input id="username" placeholder="请输入账号" name="username" class="uploadTxt uploadTxtFix" type="tel"> 
        <div class="tipinfo"></div> 
    </div>
    <div class="divregist login boxSize">
        <input id="password" name="password" type="password" placeholder="请输入密码" class="uploadTxtFix"/>
        <div class="tipinfo"></div> 
    </div>
    <input id="orgId" name="orgId" type="hidden" />
    <span id="registeFailInfo" class="registeFail" style="display:none;">登录失败</span>
    <input type="button" value="立即登录" class="loginBtn borderRadius">
</div>
<!------------登录END------------------------->
<!-------------header------------------------->
<div class="actHeader">
	<img alt="" src="/Public/images/event/banner.jpg" width="100%"/>        
</div>
<!-------------header END------------------------->
<!-------------search------------------------->
<div class="searchBox">
    <div class="search">
        <input class="txt"  placeholder="输入队名进行搜索"/>
        <span class="icon iconfont searchDel"></span>
    </div>
    <input type="button" class="searchBtn" value="">
</div>
<!-------------search  END------------------------->
<!-------------main------------------------->
<div id="main" style="position:relative">
    <div class="teacherBox" id="waterfull">
        <ul class="ulTeacher" id="ulTeacher">
        </ul>
    </div>
   <div id="imloading" class="loading">加载中</div>
</div>
<!-------------main END------------------------->
<!-------------botNav------------------------>
<div class="divfooter bot50">
    <p>浙报新媒体技术支持</p>
    <p class="pFooter">浙江日报新闻发展有限公司 | Copyright © 2014 - 2015</p>
</div>
<!-------------botNav END------------------------->
<script type="text/javascript">
    $(function() {
        /*瀑布流开始*/
        var container = $('#ulTeacher');
        var loading = $('#imloading');
        // 初始化loading状态
        loading.data("on", true);				
        /*模拟从后台获取到的数据*/
        var n = 2; /*当前页数*/

        $(window).scroll(function() { 
            if (!loading.data("on")) return;
            var itemNum = $('#waterfull').find('.liteacher').length;
            var itemArr = [];
            itemArr[0] = $('#waterfull').find('.liteacher').eq(itemNum - 1).offset().top + $('#waterfull').find('.liteacher').eq(itemNum - 1)[0].offsetHeight;
            itemArr[1] = $('#waterfull').find('.liteacher').eq(itemNum - 2).offset().top + $('#waterfull').find('.liteacher').eq(itemNum - 1)[0].offsetHeight;
            itemArr[2] = $('#waterfull').find('.liteacher').eq(itemNum - 3).offset().top + $('#waterfull').find('.liteacher').eq(itemNum - 1)[0].offsetHeight;
            var maxTop = Math.max.apply(null, itemArr);
            if (maxTop < $(window).height() + $(document).scrollTop()) {
                //加载更多数据
                loading.data("on", false).fadeIn();
                $.getJSON("/User/Event/ajaxOrgList", {page:n, id:{$eventId}}, function(sqlJson){
                    if(!sqlJson)
                    {
                        loading.text('只有这么多了！');
                    }
                    else
                    {
                        var html = "";
                        for (var i in sqlJson) {
                            html +="<li class='liteacher'>"+ "<div class='memberAll'><div class='memberPic'><img src='/Public/images/event/" + sqlJson[i].headimg + "'></div>";
                            html +="<div class='memberinfo'><div class='divHtitle'>"+sqlJson[i].name+"</div>";
                            html +="<div class='syValue'><span>"+sqlJson[i].praise+"</span><em>活力值</em></div>";
                            html +="<div class='syMember'>组员:<span>"+sqlJson[i].member+"</span></div>";
                            html +="</div></div>";
                            html +="<div class='syBtn' data-value='"+sqlJson[i].id+"'>为TA打分</div></li>";
                        }
                        /*模拟ajax请求数据时延时800毫秒*/
                        var time = setTimeout(function() {
                            var $newElems = $(html).css({
                                opacity: 0
                            }).appendTo(container);
                            $newElems.imagesLoaded(function() {
                                $newElems.animate({
                                    opacity: 1
                                }, 10);	
                                container.masonry('appended', $newElems, true);
                                loading.data("on", true).fadeOut();
                                clearTimeout(time);
                            });
                            $(".syBtn").click(function(){
                                var event = {$eventId};
                                $.ajax({
                                    url:"/?m=User&c=Event&a=ajaxOnlineCheck",
                                    type:"get",
                                    data:{"orgId":$(this).attr("data-value"), "eventId":event},
                                    success: function(result){
                                        if(result.code == 302)
                                        {
                                            $(".mask").css('display', 'block');
                                            $(".loginBox").css('display', 'block');
                                            $("#orgId").attr("value",result.orgId);
                                        }
                                        else
                                        {
                                            window.location.href = "/?m=user&c=event&a=detail&orgId="+result.orgId+"&eventId="+result.eventId;
                                        }

                                    },
                                    error: function()
                                    {
                                    }
                                });

                            });

                            $(".spanClose").click(function(){
                            $(".mask").css('display', 'none');
                            $(".loginBox").css('display', 'none');
                            $(".uploadTxtFix").val(''); 
                            });
                        }, 10)
                    }
                    n++;
                });
            }
        });
    });
</script>

<script type="text/javascript">
    $(function(){
        $(".loginBtn").click(function(){
            var event = {$eventId};
            $.ajax({
                url:"/?m=user&c=event&a=login",
                type:"post",
                data:{"orgId":$("#orgId").val(), "username":$("#username").val(), "password":$("#password").val(), "eventId":event},

                success:function(result)
                {
                    if(result.code == 200)
                    {
                        window.location.href = "/?m=user&c=event&a=detail&orgId="+result.orgId+"&eventId="+result.eventId;

                    }
                    else
                    {
                        $("#registeFailInfo").css('display', 'block');
                    }
                },
                error:function(result)
                {

                }
            });
        });
    });
</script>
</body>
</html>
